<template>
  <div class="wx_share">
    <van-share-sheet v-model="wxShareObj.showShare" title="立即分享给好友" :options="options" @select="onSelect" />

    <van-overlay :show="wxShareObj.show" @click="wxShareObj.show = false">
      <div class="wrapper" @click.stop>
        <div class="block" @click="wxShareObj.show = false">
          <ul>
            <li><img src="@a/images/activity/arrow.png" /></li>
            <li><span>点击右上角分享{{wxShareObj.showText}}给好友</span></li>
          </ul>
        </div>
      </div>
    </van-overlay>
  </div>
</template>
<script>

export default {
  name: "wxshare",
  data () {
    return {
      options: [
        { name: '微信', icon: 'wechat' },
        { name: '朋友圈', icon: 'wechat-moments' },
        { name: '复制链接', icon: 'link' },
      ],
    };
  },
  props: {
    wxShareObj: {
      //右侧文字 或 按钮
      type: Object,
      default () {
        return {
          title: '',
          text: '',
          img: '',
          getShareUrl: '',
          show: "false",
          showText: "",
        };
      },
    },
  },
  methods: {
    onSelect (option) {  //app打开分享面板
      let obj = {
        type: 2,  //1 纯文本 2 链接分享 3 图片分享
        // text_params:"xxxx",  //分享纯文本时必传
        url_params: {  //分享链接时必传
          url: this.$store.state.shareUrl + this.wxShareObj.getShareUrl,
          image: this.wxShareObj.img,
          title: this.wxShareObj.title,
          summary: this.wxShareObj.text
        },
        // imageParams:"xxxx url"  //分享图片时必传
      }
      //转字典 传参
      if (this.$store.state.Models == 'and') {
        if (option.name === '微信') {
          console.log('点击了微信------ ' + JSON.stringify(obj));
          window.android.shareWithWechat(JSON.stringify(obj))
        } else if (option.name === '朋友圈') {

          console.log('点击了朋友圈------ ' + JSON.stringify(obj));
          window.android.shareWithWechatMoment(JSON.stringify(obj))
        } else if (option.name === '复制链接') {
          this.shareLink()
        }
      } else if (this.$store.state.Models == 'ios') {
        if (option.name === '微信') {

          console.log('点击了微信------ ' + JSON.stringify(obj));
          window.webkit.messageHandlers.shareWithWechat.postMessage(JSON.stringify(obj))
        } else if (option.name === '朋友圈') {

          console.log('点击了朋友圈------ ' + JSON.stringify(obj));
          window.webkit.messageHandlers.shareWithWechatMoment.postMessage(JSON.stringify(obj))

        } else if (option.name === '复制链接') {
          this.shareLink()
        }
      }
      this.wxShareObj.showShare = false  //关闭弹窗
    },
    shareLink () {  //分享链接
      var url = this.$store.state.shareUrl + this.wxShareObj.getShareUrl;
      var oInput = document.createElement("input");
      oInput.value = url;
      document.body.appendChild(oInput);
      oInput.select(); // 选择对象
      document.execCommand("Copy"); // 执行浏览器复制命令
      oInput.className = "oInput";
      oInput.style.display = "none";
      this.$toast('已复制到剪切板');
    },
  },
};
</script>
<style lang="less" scoped>
.wrapper {
  display: flex;
  float: right;
  // align-items: center;
  // justify-content: center;
  height: 100%;
  right: 0.426667rem;
}
.block ul img {
  display: flex;
  float: right;
  padding-right: 0.8rem;
  width: 4rem;
  height: 3.6rem;
}

.block li span {
  display: flex;
  float: right;
  font-size: 0.8rem;
  padding-right: 0.8rem;
  padding-top: 0.5rem;
  color: #d9d9d9;
}
/deep/ .van-overlay {
  z-index: 9999;
}
</style>